
<template>
    <!-- 渠道信息 修改 显示 -->
    <el-card class="box-card" :body-style="getBodyStyle()">
        <div slot="header" class="clearfix">
            <span style="line-height: 36px;">渠道信息</span>
            <el-button type="primary" style="float:right" v-if="type=='修改' || type=='沟通'" @click="onChange">修改</el-button>
            <el-button type="primary" style="float:right" v-else @click="onAdd">新增</el-button>
        </div>
        <el-form ref="form" :model="form" :inline="true" class="demo-form-inline">
            <el-row>
                <el-col :span="12">
                     <el-form-item label="名称" label-width="180px" :rules="{
                                                  required: true, message: '名称不能为空', trigger: 'blur'
                                                }" :prop="'ORGANIZATION_NAME'">
                <el-input v-model="form.ORGANIZATION_NAME"></el-input>
            </el-form-item>
                </el-col>
                <el-col :span="12">
<el-form-item label="星级" label-width="180px">
                <el-select v-model="form.ORGANIZATION_LEVEL" placeholder="请选择星级">
                    <el-option label="一星" value="一星"></el-option>
                    <el-option label="二星" value="二星"></el-option>
                    <el-option label="三星" value="三星"></el-option>
                    <el-option label="四星" value="四星"></el-option>
                    <el-option label="五星" value="五星"></el-option>
                </el-select>
            </el-form-item>
                </el-col>
            </el-row>
           
             <el-row>
                <el-col :span="12">
            <el-form-item label="机构归属地" label-width="180px">
                <el-input v-model="form.ORGANIZATION_ADDRESS"></el-input>
            </el-form-item>
               </el-col>
                <el-col :span="12">
            <el-form-item label="机构规模" label-width="180px">
                <el-input v-model="form.ORGANIZATION_SCALE"></el-input>
            </el-form-item>
             </el-col>
            </el-row>
             <el-row>
                <el-col :span="12">
            <el-form-item label="产量评估" label-width="180px">
                <el-input v-model="form.ORGANIZATION_OUTPUT"></el-input>
            </el-form-item>
                </el-col>
                  <el-col :span="12">

            <el-form-item label="渠道目标客户群" label-width="180px">
                <el-input v-model="form.ORGANIZATION_TARGET"></el-input>
            </el-form-item>
                  </el-col>
             </el-row>
               <el-row>
                <el-col :span="12">
            <el-form-item label="渠道性质" label-width="180px">
                <el-input v-model="form.ORGANIZATION_TYPE"></el-input>
            </el-form-item>
                </el-col>
              <el-col :span="12">
            <el-form-item label="渠道获客方式" label-width="180px">
                <el-select v-model="form.ORGANIZATION_WAY" placeholder="请选择星级">
                    <el-option label="线上" value="线上"></el-option>
                    <el-option label="线下" value="线下"></el-option>
                </el-select>

            </el-form-item>
              </el-col>
               </el-row>
                 <el-row>
                <el-col :span="12">
            <el-form-item label="联系人" label-width="180px">
                <el-input v-model="form.ORGANIZATION_CONTACTS"></el-input>
            </el-form-item>
                </el-col>
                <el-col :span="12">
            <el-form-item label="联系电话" label-width="180px">
                <el-input v-model="form.ORGANIZATION_TEL"></el-input>
            </el-form-item>
                </el-col>
                 </el-row>
                   <el-row>
                <el-col :span="12">
            <el-form-item label="邮箱" label-width="180px">
                <el-input v-model="form.ORGANIZATION_EMAIL"></el-input>
            </el-form-item>
                </el-col>
                  <el-col :span="12">
            <el-form-item label="其他联系方式类型" label-width="180px">
                <el-select v-model="form.ORGANIZATION_OTHERTYPE" placeholder="请选择联系方式">
                    <el-option label="微信" value="微信"></el-option>
                    <el-option label="QQ" value="QQ"></el-option>
                     <el-option label="其他" value="其他"></el-option>
                </el-select>

            </el-form-item>
                  </el-col>
                   </el-row>
                    <el-row>
                <el-col :span="12">
            <el-form-item label="其它联系方式" label-width="180px">
                <el-input v-model="form.ORGANIZATION_OTHERCONNECTION"></el-input>
            </el-form-item>
                </el-col>
                   <el-col :span="12">
            <el-form-item label="地址 " label-width="180px">
                <el-input v-model="form.ORGANIZATION_ADDRESSDETAIL"></el-input>
            </el-form-item>
                   </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12"> 
            <el-form-item label="渠道获取方式" label-width="180px">
                <el-input v-model="form.ORGANIZATION_GETWAY"></el-input>
            </el-form-item>
                        </el-col>
                         <el-col :span="12">
            <el-form-item label="返佣比例 " label-width="180px">
                <el-input v-model="form.ORGANIZATION_RATIO"></el-input>
            </el-form-item>
                         </el-col>
                    </el-row>
                    <el-row>                     
            <el-form-item label="推荐人" label-width="180px">
                <el-input v-model="form.ORGANIZATION_REFERRER_NAME"  :disabled="true"></el-input>                  
            </el-form-item>
             <el-button type="primary" @click="Choose">选择</el-button>                      
                       </el-row>
                       <el-row>
                           <el-col :span="12">
            <el-form-item  label="推荐人返佣比例 " label-width="180px">
                <el-input v-model="form.ORGANIZATION_REFERRERRATIO"></el-input>
            </el-form-item>
                           </el-col>
                           <el-col :span="12">
            <el-form-item label="一级返佣比例 " label-width="180px">
                <el-input v-model="form.ORGANIZATION_UPREFERRERRATIO"></el-input>
            </el-form-item>
                           </el-col>
                       </el-row>
                       <el-row>
                             <el-col :span="12">
            <el-form-item label="备注 " label-width="180px">
                <el-input v-model="form.ORGANIZATION_REMARK"></el-input>
            </el-form-item>
                             </el-col>
                       </el-row>

        </el-form>
        <div class="space20">
        </div>
        <el-card v-if="type!='新增'">
            <div slot="header" class="clearfix">
                <span style="line-height: 36px;">客户信息</span>
            </div>
            <custom-list @goAddCommunication="goAddCommunication" @goCustomEditer="goCustomEditer" :type="'渠道'" :OrganzationId="Id">
            </custom-list>

        </el-card>
<el-dialog title="选择推荐人" :modal="false" :visible.sync="selectOrganization" v-if="selectOrganization">
    <organization-selectList type="渠道选择" :Oid="form.ORGANIZATION_ID" @selectSuccess="selectSuccess">
    </organization-selectList>
</el-dialog>
    </el-card>
</template>

<script>
// import {
//     mapState
// } from 'vuex';
import api from "@/js/api";
import getid from "@/js/getid";
import customlist from "@/components/Crm/CustomList";
import CommunicationAdd from "@/components/Crm/CommunicationAdd";
import CustomShow from "@/components/Crm/CustomShow";
import OrganizationSelectList from "@/components/Crm/OrganizationSelectList";
export default {
  data() {
    return {
      connectionAdd: false, //渠道新增
      customEditer: false,
      selectOrganization: false,
      form: {
        ORGANIZATION_ID: "",
        ORGANIZATION_NAME: "",
        ORGANIZATION_ADDRESS: "",
        ORGANIZATION_SCALE: "",
        ORGANIZATION_OUTPUT: "",
        ORGANIZATION_TARGET: "",
        ORGANIZATION_TYPE: "",
        ORGANIZATION_WAY: "",
        ORGANIZATION_CONTACTS: "",
        ORGANIZATION_TEL: "",
        ORGANIZATION_EMAIL: "",
        ORGANIZATION_OTHERTYPE: "",
        ORGANIZATION_OTHERCONNECTION: "",
        ORGANIZATION_ADDRESSDETAIL: "",
        ORGANIZATION_GETWAY: "",
        ORGANIZATION_RATIO: "",
        ORGANIZATION_REFERRER: "",
        ORGANIZATION_REFERRERRATIO: "",
        ORGANIZATION_REMARK: "",
        ORGANIZATION_TIME: "",
        ORGANIZATION_LEVEL: "",
        ORGANIZATION_UPREFERRERRATIO: "",
        ORGANIZATION_ENDTIME: "",
        ORGANIZATION_REFERRER_NAME: "",
        ADMIN_ID: ""
      }
    };
  },
  props: {
    type: {
      type: String,
      default: "新增"
    },
    Id: {
      type: String,
      default: ""
    }
  },
  components: {
    "custom-list": customlist,
    "communication-Add": CommunicationAdd,
    "custom-show": CustomShow,
    "organization-selectList": OrganizationSelectList
  },
  methods: {
    goAddCommunication(cid) {
    //   console.log("22");
      // let data = {
      //     id: cid.,
      //     type: '客户'
      // };
      this.$emit("goAddCommunication", cid);
    },
    //选择 机构
    Choose() {
      this.selectOrganization = true;
    },
    //查看修改 客戶信息
    goCustomEditer(id) {
    //   console.log("11");
      this.$emit("goCustomEditerA", id);
    },
    selectSuccess(val) {
      this.selectOrganization = false;
      this.form.ORGANIZATION_REFERRER = val.ORGANIZATION_ID;
      this.form.ORGANIZATION_REFERRER_NAME = val.ORGANIZATION_NAME;
    },
    onSubmit() {
    //   console.log("submit!");
    },
    getBodyStyle() {
      if (this.type == "沟通") {
        return "height:300px; overflow: scroll";
      }
    },
    onAdd() {
      var f = false;
      this.$refs.form.validate(valid => {
        if (valid) {
          f = true;
        }
      });
      if (!f) {
        this.$notify.error({
          title: "错误",
          message: "请将信息填写完整"
        });
        return;
      }
      let that = this;
      that.form.ORGANIZATION_ID = getid.getid();
      that.form.ADMIN_ID = sessionStorage.getItem("userId");
      that.form.ORGANIZATION_TIME = new Date();
    //   console.log(that.form.ORGANIZATION_TIME);
      if (that.form.ORGANIZATION_LEVEL == "") {
        that.form.ORGANIZATION_LEVEL = "五星";
      }
      api.OrganizationAdd(that, that.form);
    },
    //修改
    onChange() {
      var f = false;
      this.$refs.form.validate(valid => {
        if (valid) {
          f = true;
        }
      });
      if (!f) {
        this.$notify.error({
          title: "错误",
          message: "请将信息填写完整"
        });
        return;
      }
      let that = this;
      api.OrgnizationChange(that, that.form);
    }
  },
  created() {
    // console.log(this.type);
    if (this.type == "修改") {
      var data = {
        Id: this.Id
      };
      let that = this;
      api.OrgnizationGetRelationModel(that, data, function(msg) {
        that.form = msg.Result;
      });
    }
  }
};
</script>

<style>

</style>

